<template>
  <div class="detail">
    <div class="tablesB" v-if="dialogTitle == '详情信息'">
      <el-table :data="dataDetail" border>
        <el-table-column type="index" width="70" label="序号">
        </el-table-column>
        <template v-for="(item, index) in $baseBai['pharmacy_MZ_list_detail']">

          <el-table-column
            :width="item.width"
            :prop="item.prop"
            :label="item.label"
            :key="index + item"

          >
          </el-table-column>
        </template>
      </el-table>
    </div>
    <div class="tablesB" v-if="dialogTitle == '配药详情'">
      <el-table :data="dataPeiYaoDetail" border>
        <el-table-column type="index" width="70" label="序号">
        </el-table-column>
        <template v-for="(item, index) in $baseBai['pharmacy_MZ_list_PeiYao_detail']">

          <el-table-column
            :width="item.width"
            :prop="item.prop"
            :label="item.label"
            :key="index + item"

          >
          </el-table-column>
        </template>
      </el-table>
    </div>
    <div class="tablesB" v-if="dialogTitle == '退药详情'">
      <el-table :data="dataPeiYaoDetail" border>
        <el-table-column type="index" width="70" label="序号">
        </el-table-column>
        <template v-for="(item, index) in $baseBai['pharmacy_MZ_list_PeiYao_detail']">

          <el-table-column
            :width="item.width"
            :prop="item.prop"
            :label="item.label"
            :key="index + item"

          >
          </el-table-column>
        </template>
      </el-table>
    </div>
    <div class="tablesB" v-if="dialogTitle == '配药'">

      <ViewTitle style="    margin-bottom: 20px;" text="药品明细"/>
      <el-table @row-click="getPiHao" :data="dataDetail" border>
        <el-table-column type="index" width="70" label="序号">
        </el-table-column>
        <template v-for="(item, index) in $baseBai['pharmacy_MZ_peiyao']">
          <el-table-column
            :width="item.width"
            :prop="item.prop"
            :label="item.label"
            :key="index + item"


          >
          </el-table-column>
        </template>
      </el-table>
      <ViewTitle style="    margin: 20px 0;" text="配药批号"/>
      <el-table v-loading="loading" :data="dataPiHao" border>
        <el-table-column type="index" width="70" label="序号">
        </el-table-column>
        <template v-for="(item, index) in $baseBai['pharmacy_MZ_pihao']">


          <el-table-column :width="item.width" v-if="item.prop == 'number'" :prop="item.prop" :label="item.label"
                           :key="index">
            <template slot-scope="scope">
              <div>
                <el-input-number v-model="scope.row.number" controls-position="right"
                                 @change="handleChange(scope.row.id,scope.row.number,scope)" :min="0"></el-input-number>
              </div>
            </template>
          </el-table-column>
          <el-table-column v-else :width="item.width" :prop="item.prop" :label="item.label"
                           :key="index+item"></el-table-column>
        </template>
      </el-table>
    </div>
    <div class="sel" v-if="dialogTitle == '配药'">
      <el-checkbox size="small" v-model="is_hand_out">同时发药</el-checkbox>
    </div>
    <div class="buts" v-if="dialogTitle == '配药'">
      <div>
        <el-button type="info" @click="that.MZ_Detail_Show=false">取消</el-button>
      </div>
      <div>
        <el-button type="success" @click="save">确认</el-button>
      </div>
      <!-- <div class="sel"><el-checkbox :size="small" v-model="is_hand_out">同时发药</el-checkbox></div> -->
    </div>
    <div class="buts" v-if="dialogTitle == '退药详情'">
      <div>
        <el-button type="info" @click="that.MZ_Detail_Show=false">取消</el-button>
      </div>
      <div>
        <el-button type="success" @click="backDrug">确认</el-button>
      </div>
      <!-- <div class="sel"><el-checkbox :size="small" v-model="is_hand_out">同时发药</el-checkbox></div> -->
    </div>
  </div>
</template>
<script>
let t;
import ViewTitle from "@/forComponents/viewTitle/index.vue";
import {mapState, mapActions} from "vuex";

export default {
  data() {
    return {
      is_hand_out: true,
      dataPiHao: [],
      id: '',
      loading: false,
      saveData: {},

    };
  },
  components: {
    ViewTitle,
  },
  props: ["dialogTitle", 'that'],
  methods: {
    getPiHao(...item) {
      console.log("item",item)
      this.id = item[0].id;
      let d = {
        drug_id: item[0].drug_id,
      }
      this.loading = true;
      this['_API'].getDrugFillNum(d).then(res => {
        this.loading = false;
        if (res.code == 200) {

          this.saveData[item[0].id] = this.dataPiHao = res.data.map((v ,index)=> {
            let number=undefined;
            console.log("index",index)
            if(index==0&&item[0].num){
                number=item[0].num;
            }
            return {
              ...v,
              number:number,
            }
          })
          console.log(" this.saveData[item[0].id]", this.saveData)
        }
        console.log("res", res)
      })
    },
    handleChange(...item) {

      this.saveData[this.id][item[2].$index].number = item[1]

    },
    save() {
      // console.log("is_hand_out",this.is_hand_out)
      // console.log("saveData",this.saveData)
      // console.log("this.that.selectDetail",this.that.selectDetail)
      //  return
      let d = {
        recipe_id: this.that.selectDetail.id,
        data: [],
        is_hand_out: this.is_hand_out ? 1 : 2
      }

      for (const key in this.saveData) {

        let drug_fill = this.saveData[key].map(v => {
          return {
            fill_no: v.fill_no,
            num: v.number,
            useful_time: v.useful_time,
            store_address: v.store_address,
            house_num_id: v.id,
          }
        })

        d.data.push({id: key, drug_fill: drug_fill})
      }


      this['_API'].getDrugDrugDispense(d).then(res => {
        if (res.code == 200) {
          this.that.MZ_Detail_Show = false;
          this.that.getList();
        }
      })
    },

    backDrug() {
      this.$confirm('请仔细核对药品, 确认退药?', '退药提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let d = {id: this.that.item2[1].id}
        this['_API'].getStoreDrugBack(d).then(res => {
          if (res.code == 200) {
            this.$message({
              message: res.message,
              type: 'success'
            });
            this.that.MZ_Detail_Show = false;
            this.that.getList()
          }
        })
      })
    },

  },
  computed: {
    ...mapState({
      dataDetail: (state) => state.pharmacy_MZ.dataDetail,
      dataPeiYao: (state) => state.pharmacy_MZ.dataPeiYao,
      dataPeiYaoDetail: (state) => state.pharmacy_MZ.dataPeiYaoDetail,
    }),
  },

};
</script>
<style lang='scss' scoped>
.addUdetailpdate {
  padding: 0 5%;
}

/deep/ .el-dialog__body {
  height: 70vh;
  overflow: scroll;
}

.tablesB {
  padding-top: 20px;
}

.buts {
  display: flex;
  justify-content: center;
  position: relative;
  margin-top: 50px;
  justify-content: center;

  > div {
    margin-right: 20px;
  }

}

.sel {
  margin: 20px 0;
  // position: absolute;
  // right: 10%;
}
</style>
